{% extends 'layout/manage.html' %}
{% load static %}
{% block css %}
<link rel="stylesheet" href="{% static 'tracer/css/wiki.css' %}">
<link rel="stylesheet" href="{% static 'plugin/editor-md/css/editormd.preview.min.css' %}">
{% endblock %}
{% block content %}
<div class="container-fluid">
    <div class="panel panel-default">
        <div class="panel-heading">
            <div>
                <a href="{% url 'websass:wiki' project_id=request.tracer.project.id %}">
                <i class="fa fa-book" aria-hidden="true"></i> wiki文档
                </a>
            </div>
            <div class="function">
                <a type="button" class="btn btn-success btn-xs"
                   href="{% url 'websass:wiki_add' project_id=request.tracer.project.id %}">
                    <i class="fa fa-plus-circle" aria-hidden="true"></i> 新建
                </a>
                {% if wiki_object %}
                <a type="button" class="btn btn-warning btn-xs"
                   href="{% url 'websass:wiki_edit' project_id=request.tracer.project.id wiki_id=wiki_object.id %}">
                    <i class="fa fa-pencil-square-o" aria-hidden="true"></i></i> 编辑
                </a>
                 <a type="button" class="btn btn-danger btn-xs"
                   href="{% url 'websass:wiki_del' project_id=request.tracer.project.id wiki_id=wiki_object.id %}">
                   <i class="fa fa-times" aria-hidden="true"></i> 删除
                </a>
                {% endif %}
            </div>

        </div>
        <div class="panel-body">
            <div class="col-sm-3 title-list">
                <ul id="catalog">
<!--                    <li>-->
<!--                        <a>目录1</a>-->
<!--                        <ul>-->
<!--                            <li><a>子目录1</a></li>-->
<!--                            <li><a>子目录2</a></li>-->
<!--                            <li><a>子目录3</a></li>-->
<!--                        </ul>-->
<!--                    </li>-->
<!--                    <li><a>目录2</a></li>-->
<!--                    <li><a>目录3</a>-->
<!--                        <ul>-->
<!--                            <li><a>子目录1</a></li>-->
<!--                            <li><a>子目录2</a></li>-->
<!--                            <li><a>子目录3</a></li>-->
<!--                        </ul>-->
<!--                    </li>-->
                </ul>
            </div>
            <div class="col-sm-9 content">
                {% if wiki_object %}
                <div id="previewMarkdown">
                <textarea>{{ wiki_object.content }}</textarea>
                </div>
                {% else %}
                <div style="text-align:center; margin-top:50px">
                    <h4>
                        《{{ request.tracer.project.p_name }}》wiki文档库
                    </h4>
                    <a href="{% url 'websass:wiki_add' project_id=request.tracer.project.id %}">
                        <i class="fa fa-plus-square" aria-hidden="true"></i> 新建文章</a>
                </div>
                {% endif %}
            </div>
            <div></div>
        </div>
    </div>
</div>
{% endblock %}
{% block js %}
<script src="{% static 'plugin/editor-md/editormd.min.js' %}"></script>
<script src="{% static 'plugin/editor-md/lib/marked.min.js' %}"></script>
<script src="{% static 'plugin/editor-md/lib/prettify.min.js' %}"></script>
<script src="{% static 'plugin/editor-md/lib/raphael.min.js' %}"></script>
<script src="{% static 'plugin/editor-md/lib/underscore.min.js' %}"></script>
<script src="{% static 'plugin/editor-md/lib/sequence-diagram.min.js' %}"></script>
<script src="{% static 'plugin/editor-md/lib/flowchart.min.js' %}"></script>
<script src="{% static 'plugin/editor-md/lib/jquery.flowchart.min.js' %}"></script>
<script>
        var WIKI_DETAIL_URL = "{% url 'websass:wiki' project_id=request.tracer.project.id%}"
        $(function(){
            initCatalog();
            initPreviewMakeDown();
        });
        function initPreviewMakeDown(){
            editormd.markdownToHTML('previewMarkdown',{
                htmlDecode:"style,script,iframe"    //加一层过滤
            })
        }

        function initCatalog(){
            $.ajax({
                url:"{% url 'websass:wiki_catalog' project_id=request.tracer.project.id %}",
                type:"GET",
                dataType:"JSON",
                success:function(res){
                    if(res.start){
                        $.each(res.data,function(index, item){
                            var href = WIKI_DETAIL_URL + "?wiki_id=" + item.id;
                            var li = $("<li>").attr('id',"id_" + item.id).append($('<a>').text(item.title).attr('href',href)).append("<ul>");
                            if(!item.parent_id){
                               $("#catalog").append(li);
                            }else{
                                $("#id_" + item.parent_id).children("ul").append(li);
                            }
                        })
                    }else{
                        alert("初始化目录失败");
                    }
                }

            })

        }

</script>
{% endblock %}